<template>
	<view>
		<view class="box-class bgfff gui-flex gui-align-items-center">
			<view class="item bgfff gui-flex gui-flex1" @tap="$u.to(`/pages/post/post`, 'switchTab')">
				<image src="../../static/index/class1.png" mode="widthFix" style="height: auto;"></image>
				<view class="right gui-flex gui-column">
					<text class="title c333 gui-bold">找工作</text>
					<text class="desc f24">与企业直接面对面</text>
				</view>
			</view>
			<view class="item bgfff gui-flex gui-flex1" @tap="$u.to(`/pages/index/firm-list`)">
				<image src="../../static/index/class2.png" mode="widthFix" style="height: auto;"></image>
				<view class="right gui-flex gui-column">
					<text class="title c333 gui-bold">找企业</text>
					<text class="desc f24">寻找心仪企业</text>
				</view>
			</view>
		</view>
		<view class="list bgfff">
			<view class="title-line gui-bold">特色服务</view>
			<view class="service-list gui-flex gui-align-items-center gui-wrap">
				<view class="item gui-flex gui-column cfff" @tap="$u.to(`/pages/index/policy/index`)">
					<image class="bg-img" src="../../static/index/sbg_1.png" mode="aspectFill"></image>
					<text class="title z-index1">政策解读</text>
					<text class="desc f22 z-index1">及时掌握政策变化</text>
				</view>
				<view class="item gui-flex gui-column cfff" @tap="$u.to(`/pages/recruit/recruit`, 'switchTab', true)">
					<image class="bg-img" src="../../static/index/sbg_2.png" mode="aspectFill"></image>
					<text class="title z-index1">招聘会</text>
					<text class="desc f22 z-index1">线上线下更多机会</text>
				</view>
				<view class="item gui-flex gui-column cfff" @tap="$u.to(`/pages/index/help`, 'navigateTo', true)">
					<image class="bg-img" src="../../static/index/sbg_3.png" mode="aspectFill"></image>
					<text class="title z-index1">爱心助残</text>
					<text class="desc f22 z-index1">奉献每份力量</text>
				</view>
				<view class="item gui-flex gui-column cfff" @tap="$u.to(`/pages/index/evaluation/evaluation`)">
					<image class="bg-img" src="../../static/index/sbg_4.png" mode="aspectFill"></image>
					<text class="title z-index1">职业测评</text>
					<text class="desc f22 z-index1">测出你的最优职业</text>
				</view>
				<view class="item gui-flex gui-column cfff" @tap="jumpTraining">
					<image class="bg-img" src="../../static/index/sbg_5.png" mode="aspectFill"></image>
					<text class="title z-index1">职业培训</text>
					<text class="desc f22 z-index1">在线学习职业培训</text>
				</view>
				<view class="item gui-flex gui-column cfff"
					@tap="$u.to('/pages/index/security-deposit/security-deposit')">
					<image class="bg-img" src="../../static/index/sbg_6.png" mode="aspectFill"></image>
					<text class="title z-index1">保障金年审</text>
					<text class="desc f22 z-index1">残疾人就业保障金</text>
				</view>
			</view>
			<view class="flex-ac-jb">
				<view class="title-line gui-bold">岗位推荐</view>
				<image class="reflesh-icon" :class="{'reflesh-icon-true':isReflesh}" @tap="refleshList"
					src="../../static/index/reflesh.png" mode="widthFix"></image>
			</view>
			<view class="post-list">
				<gui-empty v-if="dataList.length <= 0">
					<template v-slot:img>
						<view class="gui-flex gui-rows gui-justify-content-center">
							<image class="nodata-img" src="../../static/image/no_curriculum_vitae.png" mode="widthFix">
							</image>
						</view>
					</template>
					<template v-slot:text>
						<text class="gui-text-small gui-block gui-text-center gui-margin-top gui-color-gray">暂无数据</text>
					</template>
				</gui-empty>
				<view class="item" @click="$u.to(`/pages/post/postDetail?id=${item.id}`)"
					v-for="(item,index) in dataList" :key="item.id">
					<view class="flex-ac-jb">
						<text class="title">{{item.postName}}</text>
						<text class="pay f24 colorRed">{{item.postMoney}}</text>
					</view>
					<view class="info flex-ac f22">
						<text>{{item.addressInfo}} {{item.work}} {{item.education}} 招{{item.recruitNum}}人</text>
					</view>
					<view class="flex-ac-row f18" v-if="item.comUsertConpanyInfo.welfareTreatment">
						<view class="post-label c999"
							v-for="(wItem,wIndex) in item.comUsertConpanyInfo.welfareTreatment.split(',')"
							:key="wIndex">{{wItem}}</view>
					</view>
					<view class="company flex-ac-jb">
						<view class="left flex-ac">
							<image class="qiye-icon" src="../../static/index/qiye.png" mode="widthFix"
								style="height: auto;"></image>
							<text class="c666 f24">{{item.comUsertConpanyInfo.companyName}}</text>
						</view>
						<text class="c999 f20">信息来源：徐州市本级</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive,
		inject,
		defineEmits
	} from 'vue'
	import {
		selectUserInfoPostListPage
	} from '@/api/user.js';
	import {
		getIndexOnload
	} from '@/api/app.js';
	
	const $u = reactive(inject('$u'));
	const emit = defineEmits(['pageChange'])
	const query = ref({
		pageNum: 1,
		pageSize: 10
	})
	const isReflesh = ref(false)
	const dataList = ref([])

	const reload = () => {
		query.value.pageNum = 1;
		loadData(true);
	}

	const loadData = (isReload) => {
		let queryParam = Object.assign(query.value, {})
		selectUserInfoPostListPage(queryParam).then(res => {
			if (res.code == 200) {
				var resultArr = res.rows;
				let total = Math.ceil(res.total / queryParam.pageSize);
				if (queryParam.pageNum >= 2) {
					dataList.value = dataList.value.concat(resultArr);
					emit('pageChange', {
						value: 'stoploadmore'
					})
					// 假定第3页加载了全部数据，通知组件不再加载更多
					// 实际开发由接口返回值来决定
					if (queryParam.pageNum >= total) {
						emit('pageChange', {
							value: 'nomore'
						})
					}
				}
				// 第一页 有可能是第一次加载或者刷新
				else {
					dataList.value = [];
					dataList.value = resultArr;
					// 刷新
					if (isReload) {
						emit('pageChange', {
							value: 'endReload'
						})
					} else {
						emit('pageChange', {
							value: 'stoploadmore'
						})
					}
				}
				query.value.pageNum++;
			}
		})
	}

	const refleshList = () => {
		query.value.pageNum = 1;
		let queryParam = Object.assign(query.value, {})
		isReflesh.value = true;
		selectUserInfoPostListPage(queryParam).then(res => {
			if (res.code == 200) {
				var resultArr = res.rows;
				dataList.value = [];
				dataList.value = resultArr;
				query.value.pageNum++;
				emit('pageChange', {
					value: 'stoploadmore'
				})
			}
		}).finally(() => {
			isReflesh.value = false;
		})
	}

	loadData();

	const jumpTraining = () => {
		$u.to('/pages/index/training')
		/* getIndexOnload().then(res => {
			if(res.code == 200) {
				if(res.data == 1) {
					$u.to('/pages/index/training')
				}else {
					$u.to('/pages/index/training-demo')
				}
			}
		}) */
	}

	// 抛出函数
	defineExpose({
		loadData,
		reload
	})
</script>